<template>
  <div class="pagination">

    <el-pagination
    middle
    background
    layout="prev, pager, next"
    :page-size='pagesize'
    :total='total'
    class="mt-4"
    @current-change="currentChange"
    @prev-click="currentChange('pre')"
    @next-click="currentChange('next')"
  />

    <!-- <el-button type="primary" @click="currentChange('pre')">上一页</el-button>
    <el-button type="primary" @click="currentChange('next')">下一页</el-button> -->
  </div>
</template>
<script  setup>
import { defineProps } from 'vue';

const { currentChange ,pagesize,total,currentPage} = defineProps(['currentChange','pagesize','total','currentPage']);
console.log(pagesize,total);
</script>
<style lang="less" scoped>
.pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  color: #fff;

  .pre {
    background-color: #409eff;
    margin-right: 10px;
    padding: 5px;
  }

  .next {
    padding: 5px;
    background-color: #409eff;
  }
}
</style>


